<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>Ship Admin</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">

    <span th:replace="common::header"></span>

    <span th:replace="common::side"></span>

    <div class="layui-body">
        <!-- 内容主体区域 -->

        <div class="layui-card">
            <div class="layui-card-header">
            </div>
            <div class="layui-card-body">

                <table class="layui-table">
                    <colgroup>
                        <col width="150">
                        <col width="200">
                        <col>
                    </colgroup>
                    <thead>
                    <tr>
                        <th>序号</th>
                        <th>服务名称</th>
                        <th>版本</th>
                        <th>IP</th>
                        <th>端口号</th>
                        <th>权重</th>
                        <th>创建时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="item,iterStat:${instanceVOS}">
                        <td th:text="${iterStat.count}">1</td>
                        <td th:text="${item.appName}">order</td>
                        <td th:text="${item.version}">gray_1.0</td>
                        <td th:text="${item.ip}">127.0.0.1</td>
                        <td th:text="${item.port}">8080</td>
                        <td>
                            <input type="text" name="weight" autocomplete="off" class="layui-input"
                                   th:value="${item.weight}"
                                   th:id="${item.id}" th:onblur="modifyWeight(this,[[${item.id}]]);">
                        </td>
                        <td th:text="${item.createdTime}">2020-12-26 10:00:00</td>
                        <td>
                            <button type="button" class="layui-btn ayui-btn-xs">设置</button>
                        </td>
                    </tr>

                    </tbody>
                </table>

            </div>
        </div>


    </div>

    <span th:replace="common::footer"></span>
</div>
<script src="/static/layui/layui.js"></script>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script>
    //JavaScript代码区域
    layui.use('element', function () {
        var element = layui.element;

    });
    var layer;
    layui.use('layer', function () {
        layer = layui.layer;
    });

    function modifyWeight(obj, id) {
        let req = {
            "id": id,
            "weight": obj.value
        }
        $.ajax({
            type: "PUT",
            url: "/app/instance",
            data: JSON.stringify(req),
            dataType: "json",
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            },
            success: function (data) {
                if (data.code == 200) {
                    layer.msg("更新权重成功");
                    location.reload();
                } else {
                    layer.msg(data.message);
                }
            },
            error: function (e) {
                layer.msg(e);
            }
        });
    }
</script>
</body>
</html>


